<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="UTF-8">
		<link rel="stylesheet" type="text/css" href="static/css/succulent.css">
		<link rel="stylesheet" href="static/css/zzsc.css" />
		<link rel="stylesheet" href="static/src/jquery.skidder.css" />
		<title>二手商场</title>
	</head>
	<body>
		<header>
			<div class="bar">
				<form>
					<input type="text" placeholder="请输入您要搜索的内容...">
					<button type="submit" id="button1">搜索</button>
				</form>
			</div>
			<div class="a">
				<a href="${basePath}JumpServlet?jump=WEB-INF/logined/Login interface">
					<button id="button1">登录</button>
				</a>
				<a href="${basePath}JumpServlet?jump=WEB-INF/logined/zhuce">
				<button type="button" id="button1">注册</button>
				</a>
			</div>
		</header>
		<div class="slideshow" style="height: 0; margin-top:15px;overflow: hidden">
			<div class="slide"><img src="static/img/1.jpg"></div>
			<div class="slide"><img src="static/img/2.jpg"></div>
			<div class="slide"><img src="static/img/3.jpg"></div>
			<div class="slide"><img src="static/img/4.jpg"></div>
			<div class="slide"><img src="static/img/5.jpg"></div>
		</div>
		<div class="htmleaf-container">
			<nav class="animenu">
				<button class="animenu__toggle">
		<span class="animenu__toggle__bar"></span>
		<span class="animenu__toggle__bar"></span>
		<span class="animenu__toggle__bar"></span>
	  </button>

			</nav>
		</div>
		<div class="img">
			<img src="images/illust_63373510_20180526_013839.jpg" width="100%" />
		</div>
		<div class="border-radius">最新商品</div>
		<div class="main">
			<div class="view">
				<img src="static/images/1.jpg" alt="">
				<div class="hover">
					<h3></h3>
					<p style="font-size: 16px;color: #46B8DA;"><a href=" # ">购买</a></p>
					<p style="font-size: 16px;color: #46B8DA;"><a href="${basePath}JumpServlet?jump=WEB-INF/logined/joinshoppingcar">加入购物车</a></p>
				</div>
			</div>
			<div class="view ">
				<img src="static/images/7.jpg " alt=" ">
				<div class="hover ">
					<h3></h3>
	<p style="font-size: 16px;color: #46B8DA;"><a href=" # ">购买</a></p>
					<p style="font-size: 16px;color: #46B8DA;"><a href="${basePath}JumpServlet?jump=WEB-INF/logined/joinshoppingcar">加入购物车</a></p>
				</div>
			</div>
			<div class="view ">
				<img src="static/images/3.jpg " alt=" ">
				<div class="hover ">
					<h3></h3>
			<p style="font-size: 16px;color: #46B8DA;"><a href=" # ">购买</a></p>
					<p style="font-size: 16px;color: #46B8DA;"><a href="${basePath}JumpServlet?jump=WEB-INF/logined/joinshoppingcar">加入购物车</a></p>
				</div>
			</div>
			<div class="view ">
				<img src="static/images/4.jpg " alt=" ">
				<div class="hover ">
					<h3></h3>
					<p style="font-size: 16px;color: #46B8DA;"><a href=" # ">购买</a></p>
					<p style="font-size: 16px;color: #46B8DA;"><a href="${basePath}JumpServlet?jump=WEB-INF/logined/joinshoppingcar">加入购物车</a></p>
				</div>
			</div>
			<div class="view ">
				<img src="static/images/5.jpg " alt=" ">
				<div class="hover ">
					<h3></h3>
				<p style="font-size: 16px;color: #46B8DA;"><a href=" # ">购买</a></p>
					<p style="font-size: 16px;color: #46B8DA;"><a href="${basePath}JumpServlet?jump=WEB-INF/logined/joinshoppingcar">加入购物车</a></p>
				</div>
			</div>
			<div class="view ">
				<img src="static/images/6.jpg " alt=" ">
				<div class="hover ">
					<h3></h3>
					<p style="font-size: 16px;color: #46B8DA;"><a href=" # ">购买</a></p>
					<p style="font-size: 16px;color: #46B8DA;"><a href="${basePath}JumpServlet?jump=WEB-INF/logined/joinshoppingcar">加入购物车</a></p>
				</div>
			</div>
			<div class="view ">
				<img src="static/images/2.jpg " alt=" ">
				<div class="hover ">
					<h3></h3>
<p style="font-size: 16px;color: #46B8DA;"><a href=" # ">购买</a></p>
					<p style="font-size: 16px;color: #46B8DA;"><a href="${basePath}JumpServlet?jump=WEB-INF/logined/joinshoppingcar">加入购物车</a></p>
				</div>
			</div>
			<div class="view ">
				<img src="static/images/1.jpg " alt=" ">
				<div class="hover ">
					<h3></h3>
				<p style="font-size: 16px;color: #46B8DA;"><a href=" # ">购买</a></p>
					<p style="font-size: 16px;color: #46B8DA;"><a href="${basePath}JumpServlet?jump=WEB-INF/logined/joinshoppingcar">加入购物车</a></p>
				</div>
			</div>
			<div class="view ">
				<img src="static/images/2.jpg " alt=" ">
				<div class="hover ">
					<h3></h3>
					<p style="font-size: 16px;color: #46B8DA;"><a href=" # ">购买</a></p>
					<p style="font-size: 16px;color: #46B8DA;"><a href="${basePath}JumpServlet?jump=WEB-INF/logined/joinshoppingcar">加入购物车</a></p>
				</div>
			</div>
			<div class="view ">
				<img src="static/images/3.jpg " alt=" ">
				<div class="hover ">
					<h3></h3>
		<p style="font-size: 16px;color: #46B8DA;"><a href=" # ">购买</a></p>
					<p style="font-size: 16px;color: #46B8DA;"><a href="${basePath}JumpServlet?jump=WEB-INF/logined/joinshoppingcar">加入购物车</a></p>
				</div>
			</div>
			<div class="view ">
				<img src="static/images/4.jpg " alt=" ">
				<div class="hover ">
					<h3></h3>
	<p style="font-size: 16px;color: #46B8DA;"><a href=" # ">购买</a></p>
					<p style="font-size: 16px;color: #46B8DA;"><a href="${basePath}JumpServlet?jump=WEB-INF/logined/joinshoppingcar">加入购物车</a></p>
				</div>
			</div>
			<div class="view ">
				<img src="static/images/5.jpg " alt=" ">
				<div class="hover ">
					<h3></h3>
	<p style="font-size: 16px;color: #46B8DA;"><a href=" # ">购买</a></p>
					<p style="font-size: 16px;color: #46B8DA;"><a href="${basePath}JumpServlet?jump=WEB-INF/logined/joinshoppingcar">加入购物车</a></p>
				</div>
			</div>
			<div class="view ">
				<img src="static/images/6.jpg " alt=" ">
				<div class="hover ">
					<h3></h3>
	<p style="font-size: 16px;color: #46B8DA;"><a href=" # ">购买</a></p>
					<p style="font-size: 16px;color: #46B8DA;"><a href="${basePath}JumpServlet?jump=WEB-INF/logined/joinshoppingcar">加入购物车</a></p>
				</div>
			</div>
			<div class="view ">
				<img src="static/images/7.jpg " alt=" ">
				<div class="hover ">
					<h3></h3>
	<p style="font-size: 16px;color: #46B8DA;"><a href=" # ">购买</a></p>
					<p style="font-size: 16px;color: #46B8DA;"><a href="${basePath}JumpServlet?jump=WEB-INF/logined/joinshoppingcar">加入购物车</a></p>
				</div>
			</div>
			<div class="view ">
				<img src="static/images/8.jpg " alt=" ">
				<div class="hover ">
					<h3></h3>
	<p style="font-size: 16px;color: #46B8DA;"><a href=" # ">购买</a></p>
					<p style="font-size: 16px;color: #46B8DA;"><a href="${basePath}JumpServlet?jump=WEB-INF/logined/joinshoppingcar">加入购物车</a></p>
				</div>
			</div>
			<div class="view ">
				<img src="static/images/7.jpg " alt=" ">
				<div class="hover ">
					<h3></h3>
	<p style="font-size: 16px;color: #46B8DA;"><a href=" # ">购买</a></p>
					<p style="font-size: 16px;color: #46B8DA;"><a href="${basePath}JumpServlet?jump=WEB-INF/logined/joinshoppingcar">加入购物车</a></p>
				</div>
			</div>
			<div class="view ">
				<img src="static/images/5.jpg " alt=" ">
				<div class="hover ">
					<h3></h3>
	<p style="font-size: 16px;color: #46B8DA;"><a href=" # ">购买</a></p>
					<p style="font-size: 16px;color: #46B8DA;"><a href="${basePath}JumpServlet?jump=WEB-INF/logined/joinshoppingcar">加入购物车</a></p>
				</div>
			</div>
			<div class="view ">
				<img src="static/images/6.jpg " alt=" ">
				<div class="hover ">
					<h3></h3>
	<p style="font-size: 16px;color: #46B8DA;"><a href=" # ">购买</a></p>
					<p style="font-size: 16px;color: #46B8DA;"><a href="${basePath}JumpServlet?jump=WEB-INF/logined/joinshoppingcar">加入购物车</a></p>
				</div>
			</div>
		</div>
		<footer>
			<p></p>
			<div class="services">品质保障|七天无理由退换货|特色服务体验 </div>
		</footer>
		<script type="text/javascript" src="static/jquery/jquery.min.js"></script>
		<script type="text/javascript" src="static/src/jquery.skidder.js"></script>
		<script type="text/javascript" src="static/js/imagesloaded.js"></script>
		<script type="text/javascript" src="static/js/smartresize.js"></script>
		<script src="static/src/jquery.skidder.js"></script>
		<script type="text/javascript">
			$('.slideshow').each(function() {
				var $slideshow = $(this);
				$slideshow.imagesLoaded(function() {
					$slideshow.skidder({
						slideClass: '.slide',
						animationType: 'css',
						scaleSlides: true,
						maxWidth: 1300,
						maxHeight: 500,
						paging: true,
						autoPaging: true,
						pagingWrapper: ".skidder-pager",
						pagingElement: ".skidder-pager-dot",
						swiping: true,
						leftaligned: false,
						cycle: true,
						jumpback: false,
						speed: 400,
						autoplay: false,
						autoplayResume: false,
						interval: 4000,
						transition: "slide",
						afterSliding: function() {},
						afterInit: function() {}
					});
				});
			});
			$(window).smartresize(function() {
				$('.slideshow').skidder('resize');
			});
		</script>
		<script type="text/javascript">
			(function() {
				var animenuToggle = document.querySelector('.animenu__toggle'),
					animenuNav = document.querySelector('.animenu__nav'),
					hasClass = function(elem, className) {
						return new RegExp(' ' + className + ' ').test(' ' + elem.className + ' ');
					},
					toggleClass = function(elem, className) {
						var newClass = ' ' + elem.className.replace(/[\t\r\n]/g, ' ') + ' ';
						if(hasClass(elem, className)) {
							while(newClass.indexOf(' ' + className + ' ') >= 0) {
								newClass = newClass.replace(' ' + className + ' ', ' ');
							}
							elem.className = newClass.replace(/^\s+|\s+$/g, '');
						} else {
							elem.className += ' ' + className;
						}
					},
					animenuToggleNav = function() {
						toggleClass(animenuToggle, "animenu__toggle--active");
						toggleClass(animenuNav, "animenu__nav--open");
					}

				if(!animenuToggle.addEventListener) {
					animenuToggle.attachEvent("onclick", animenuToggleNav);
				} else {
					animenuToggle.addEventListener('click', animenuToggleNav);
				}
			})()
		</script>
	</body>

</html>